<html><head><meta http-equiv="content-type" content="text/html; charset=utf-8"> <style>
	.KEYW {color: #933;}
	.COMM {color: #bbb; font-style: italic;}
	.NUMB {color: #393;}
	.STRN {color: #393;}
	.REGX {color: #339;}
	.line {border-right: 1px dotted #666; color: #666; font-style: normal;}
	</style></head><body><pre><span class='line'>  1</span> <span class="COMM">// TODO share code with Treemap</span><span class="WHIT">
<span class='line'>  2</span> </span><span class="COMM">// TODO vertical / horizontal orientation?</span><span class="WHIT">
<span class='line'>  3</span> 
<span class='line'>  4</span> </span><span class="COMM">/**
<span class='line'>  5</span>  * Returns a new icicle tree layout.
<span class='line'>  6</span>  *
<span class='line'>  7</span>  * @class A tree layout in the form of an icicle. &lt;img src="../icicle.png"
<span class='line'>  8</span>  * width="160" height="160" align="right"> The first row corresponds to the root
<span class='line'>  9</span>  * of the tree; subsequent rows correspond to each tier. Rows are subdivided
<span class='line'> 10</span>  * into cells based on the size of nodes, per {@link #size}. Within a row, cells
<span class='line'> 11</span>  * are sorted by size.
<span class='line'> 12</span>  *
<span class='line'> 13</span>  * &lt;p>This tree layout is intended to be extended (see {@link pv.Mark#extend})
<span class='line'> 14</span>  * by a {@link pv.Bar}. The data property returns an array of nodes for use by
<span class='line'> 15</span>  * other property functions. The following node attributes are supported:
<span class='line'> 16</span>  *
<span class='line'> 17</span>  * &lt;ul>
<span class='line'> 18</span>  * &lt;li>&lt;tt>left&lt;/tt> - the cell left position.
<span class='line'> 19</span>  * &lt;li>&lt;tt>top&lt;/tt> - the cell top position.
<span class='line'> 20</span>  * &lt;li>&lt;tt>width&lt;/tt> - the cell width.
<span class='line'> 21</span>  * &lt;li>&lt;tt>height&lt;/tt> - the cell height.
<span class='line'> 22</span>  * &lt;li>&lt;tt>depth&lt;/tt> - the node depth (tier; the root is 0).
<span class='line'> 23</span>  * &lt;li>&lt;tt>keys&lt;/tt> - an array of string keys for the node.
<span class='line'> 24</span>  * &lt;li>&lt;tt>size&lt;/tt> - the aggregate node size.
<span class='line'> 25</span>  * &lt;li>&lt;tt>children&lt;/tt> - child nodes, if any.
<span class='line'> 26</span>  * &lt;li>&lt;tt>data&lt;/tt> - the associated tree element, for leaf nodes.
<span class='line'> 27</span>  * &lt;/ul>
<span class='line'> 28</span>  *
<span class='line'> 29</span>  * To produce a default icicle layout, say:
<span class='line'> 30</span>  *
<span class='line'> 31</span>  * &lt;pre>.add(pv.Bar)
<span class='line'> 32</span>  *   .extend(pv.Layout.icicle(tree))&lt;/pre>
<span class='line'> 33</span>  *
<span class='line'> 34</span>  * To customize the tree to highlight leaf nodes bigger than 10,000 (1E4), you
<span class='line'> 35</span>  * might say:
<span class='line'> 36</span>  *
<span class='line'> 37</span>  * &lt;pre>.add(pv.Bar)
<span class='line'> 38</span>  *   .extend(pv.Layout.icicle(tree))
<span class='line'> 39</span>  *   .fillStyle(function(n) n.data > 1e4 ? "#ff0" : "#fff")&lt;/pre>
<span class='line'> 40</span>  *
<span class='line'> 41</span>  * The format of the &lt;tt>tree&lt;/tt> argument is any hierarchical object whose
<span class='line'> 42</span>  * leaf nodes are numbers corresponding to their size. For an example, and
<span class='line'> 43</span>  * information on how to convert tabular data into such a tree, see
<span class='line'> 44</span>  * {@link pv.Tree}. If the leaf nodes are not numbers, a {@link #size} function
<span class='line'> 45</span>  * can be specified to override how the tree is interpreted. This size function
<span class='line'> 46</span>  * can also be used to transform the data.
<span class='line'> 47</span>  *
<span class='line'> 48</span>  * &lt;p>By default, the icicle fills the full width and height of the parent
<span class='line'> 49</span>  * panel. An optional root key can be specified using {@link #root} for
<span class='line'> 50</span>  * convenience.
<span class='line'> 51</span>  *
<span class='line'> 52</span>  * @param tree a tree (an object) who leaf attributes have sizes.
<span class='line'> 53</span>  * @returns {pv.Layout.icicle} a tree layout.
<span class='line'> 54</span>  */</span><span class="WHIT">
<span class='line'> 55</span> </span><span class="NAME">pv.Layout.icicle</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">tree</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 56</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">keys</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">[</span><span class="PUNC">]</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">sizeof</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">Number</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 57</span> 
<span class='line'> 58</span> </span><span class="WHIT">  </span><span class="COMM">/** @private */</span><span class="WHIT">
<span class='line'> 59</span> </span><span class="WHIT">  </span><span class="KEYW">function</span><span class="WHIT"> </span><span class="NAME">accumulate</span><span class="PUNC">(</span><span class="NAME">map</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 60</span> </span><span class="WHIT">    </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">node</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">size</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">children</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="PUNC">[</span><span class="PUNC">]</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">keys</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">keys.slice</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 61</span> </span><span class="WHIT">    </span><span class="KEYW">for</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">key</span><span class="WHIT"> </span><span class="KEYW">in</span><span class="WHIT"> </span><span class="NAME">map</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 62</span> </span><span class="WHIT">      </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">child</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">map</span><span class="PUNC">[</span><span class="NAME">key</span><span class="PUNC">]</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">size</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">sizeof</span><span class="PUNC">(</span><span class="NAME">child</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 63</span> </span><span class="WHIT">      </span><span class="NAME">keys.push</span><span class="PUNC">(</span><span class="NAME">key</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 64</span> </span><span class="WHIT">      </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">isNaN</span><span class="PUNC">(</span><span class="NAME">size</span><span class="PUNC">)</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 65</span> </span><span class="WHIT">        </span><span class="NAME">child</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">accumulate</span><span class="PUNC">(</span><span class="NAME">child</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 66</span> </span><span class="WHIT">      </span><span class="PUNC">}</span><span class="WHIT"> </span><span class="KEYW">else</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 67</span> </span><span class="WHIT">        </span><span class="NAME">child</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">size</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">size</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">data</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">child</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">keys</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">keys.slice</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 68</span> </span><span class="WHIT">      </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'> 69</span> </span><span class="WHIT">      </span><span class="NAME">node.children.push</span><span class="PUNC">(</span><span class="NAME">child</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 70</span> </span><span class="WHIT">      </span><span class="NAME">node.size</span><span class="WHIT"> </span><span class="PUNC">+</span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">child.size</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 71</span> </span><span class="WHIT">      </span><span class="NAME">keys.pop</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 72</span> </span><span class="WHIT">    </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'> 73</span> </span><span class="WHIT">    </span><span class="NAME">node.children.sort</span><span class="PUNC">(</span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">a</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">b</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT"> </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">b.size</span><span class="WHIT"> </span><span class="PUNC">-</span><span class="WHIT"> </span><span class="NAME">a.size</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 74</span> </span><span class="WHIT">    </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">node</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 75</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'> 76</span> 
<span class='line'> 77</span> </span><span class="WHIT">  </span><span class="COMM">/** @private */</span><span class="WHIT">
<span class='line'> 78</span> </span><span class="WHIT">  </span><span class="KEYW">function</span><span class="WHIT"> </span><span class="NAME">scale</span><span class="PUNC">(</span><span class="NAME">node</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">k</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 79</span> </span><span class="WHIT">    </span><span class="NAME">node.size</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">k</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 80</span> </span><span class="WHIT">    </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">node.children</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 81</span> </span><span class="WHIT">      </span><span class="KEYW">for</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">&lt;</span><span class="WHIT"> </span><span class="NAME">node.children.length</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">i</span><span class="PUNC">++</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 82</span> </span><span class="WHIT">        </span><span class="NAME">scale</span><span class="PUNC">(</span><span class="NAME">node.children</span><span class="PUNC">[</span><span class="NAME">i</span><span class="PUNC">]</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">k</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 83</span> </span><span class="WHIT">      </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'> 84</span> </span><span class="WHIT">    </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'> 85</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'> 86</span> 
<span class='line'> 87</span> </span><span class="WHIT">  </span><span class="COMM">/** @private */</span><span class="WHIT">
<span class='line'> 88</span> </span><span class="WHIT">  </span><span class="KEYW">function</span><span class="WHIT"> </span><span class="NAME">depth</span><span class="PUNC">(</span><span class="NAME">node</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">i</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 89</span> </span><span class="WHIT">    </span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">?</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">+</span><span class="WHIT"> </span><span class="NUMB">1</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 90</span> </span><span class="WHIT">    </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">node.children</span><span class="WHIT">
<span class='line'> 91</span> </span><span class="WHIT">        </span><span class="PUNC">?</span><span class="WHIT"> </span><span class="NAME">pv.max</span><span class="PUNC">(</span><span class="NAME">node.children</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">n</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT"> </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">depth</span><span class="PUNC">(</span><span class="NAME">n</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">i</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">)</span><span class="WHIT">
<span class='line'> 92</span> </span><span class="WHIT">        </span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">i</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 93</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'> 94</span> 
<span class='line'> 95</span> </span><span class="WHIT">  </span><span class="COMM">/** @private */</span><span class="WHIT">
<span class='line'> 96</span> </span><span class="WHIT">  </span><span class="KEYW">function</span><span class="WHIT"> </span><span class="NAME">layout</span><span class="PUNC">(</span><span class="NAME">node</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 97</span> </span><span class="WHIT">    </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">node.children</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 98</span> </span><span class="WHIT">      </span><span class="NAME">icify</span><span class="PUNC">(</span><span class="NAME">node</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 99</span> </span><span class="WHIT">      </span><span class="KEYW">for</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">&lt;</span><span class="WHIT"> </span><span class="NAME">node.children.length</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">i</span><span class="PUNC">++</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>100</span> </span><span class="WHIT">        </span><span class="NAME">layout</span><span class="PUNC">(</span><span class="NAME">node.children</span><span class="PUNC">[</span><span class="NAME">i</span><span class="PUNC">]</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>101</span> </span><span class="WHIT">      </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>102</span> </span><span class="WHIT">    </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>103</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>104</span> 
<span class='line'>105</span> </span><span class="WHIT">  </span><span class="COMM">/** @private */</span><span class="WHIT">
<span class='line'>106</span> </span><span class="WHIT">  </span><span class="KEYW">function</span><span class="WHIT"> </span><span class="NAME">icify</span><span class="PUNC">(</span><span class="NAME">node</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>107</span> </span><span class="WHIT">    </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">left</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">node.left</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>108</span> </span><span class="WHIT">    </span><span class="KEYW">for</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">&lt;</span><span class="WHIT"> </span><span class="NAME">node.children.length</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">i</span><span class="PUNC">++</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>109</span> </span><span class="WHIT">      </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">child</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">node.children</span><span class="PUNC">[</span><span class="NAME">i</span><span class="PUNC">]</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">width</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">child.size</span><span class="WHIT"> </span><span class="PUNC">/</span><span class="WHIT"> </span><span class="NAME">node.size</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NAME">node.width</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>110</span> </span><span class="WHIT">      </span><span class="NAME">child.left</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">left</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>111</span> </span><span class="WHIT">      </span><span class="NAME">child.top</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">node.top</span><span class="WHIT"> </span><span class="PUNC">+</span><span class="WHIT"> </span><span class="NAME">node.height</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>112</span> </span><span class="WHIT">      </span><span class="NAME">child.width</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">width</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>113</span> </span><span class="WHIT">      </span><span class="NAME">child.height</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">node.height</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>114</span> </span><span class="WHIT">      </span><span class="NAME">child.depth</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">node.depth</span><span class="WHIT"> </span><span class="PUNC">+</span><span class="WHIT"> </span><span class="NUMB">1</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>115</span> </span><span class="WHIT">      </span><span class="NAME">left</span><span class="WHIT"> </span><span class="PUNC">+</span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">width</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>116</span> </span><span class="WHIT">      </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">child.children</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>117</span> </span><span class="WHIT">        </span><span class="NAME">icify</span><span class="PUNC">(</span><span class="NAME">child</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>118</span> </span><span class="WHIT">      </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>119</span> </span><span class="WHIT">    </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>120</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>121</span> 
<span class='line'>122</span> </span><span class="WHIT">  </span><span class="COMM">/** @private */</span><span class="WHIT">
<span class='line'>123</span> </span><span class="WHIT">  </span><span class="KEYW">function</span><span class="WHIT"> </span><span class="NAME">flatten</span><span class="PUNC">(</span><span class="NAME">node</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">array</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>124</span> </span><span class="WHIT">    </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">node.children</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>125</span> </span><span class="WHIT">      </span><span class="KEYW">for</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">&lt;</span><span class="WHIT"> </span><span class="NAME">node.children.length</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">i</span><span class="PUNC">++</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>126</span> </span><span class="WHIT">        </span><span class="NAME">flatten</span><span class="PUNC">(</span><span class="NAME">node.children</span><span class="PUNC">[</span><span class="NAME">i</span><span class="PUNC">]</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">array</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>127</span> </span><span class="WHIT">      </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>128</span> </span><span class="WHIT">    </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>129</span> </span><span class="WHIT">    </span><span class="NAME">array.push</span><span class="PUNC">(</span><span class="NAME">node</span><span class="PUNC">)</span><span class="WHIT">
<span class='line'>130</span> </span><span class="WHIT">    </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">array</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>131</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>132</span> 
<span class='line'>133</span> </span><span class="WHIT">  </span><span class="COMM">/** @private */</span><span class="WHIT">
<span class='line'>134</span> </span><span class="WHIT">  </span><span class="KEYW">function</span><span class="WHIT"> </span><span class="NAME">data</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>135</span> </span><span class="WHIT">    </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">root</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">accumulate</span><span class="PUNC">(</span><span class="NAME">tree</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>136</span> </span><span class="WHIT">    </span><span class="NAME">root.top</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>137</span> </span><span class="WHIT">    </span><span class="NAME">root.left</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>138</span> </span><span class="WHIT">    </span><span class="NAME">root.width</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">this.parent.width</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>139</span> </span><span class="WHIT">    </span><span class="NAME">root.height</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">this.parent.height</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">/</span><span class="WHIT"> </span><span class="NAME">depth</span><span class="PUNC">(</span><span class="NAME">root</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>140</span> </span><span class="WHIT">    </span><span class="NAME">root.depth</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>141</span> </span><span class="WHIT">    </span><span class="NAME">layout</span><span class="PUNC">(</span><span class="NAME">root</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>142</span> </span><span class="WHIT">    </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">flatten</span><span class="PUNC">(</span><span class="NAME">root</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="PUNC">[</span><span class="PUNC">]</span><span class="PUNC">)</span><span class="PUNC">.</span><span class="NAME">reverse</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>143</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>144</span> 
<span class='line'>145</span> </span><span class="WHIT">  </span><span class="COMM">/* A dummy mark, like an anchor, which the caller extends. */</span><span class="WHIT">
<span class='line'>146</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">mark</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">new</span><span class="WHIT"> </span><span class="NAME">pv.Mark</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="WHIT">
<span class='line'>147</span> </span><span class="WHIT">      </span><span class="PUNC">.</span><span class="NAME">data</span><span class="PUNC">(</span><span class="NAME">data</span><span class="PUNC">)</span><span class="WHIT">
<span class='line'>148</span> </span><span class="WHIT">      </span><span class="PUNC">.</span><span class="NAME">left</span><span class="PUNC">(</span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">n</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT"> </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">n.left</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">)</span><span class="WHIT">
<span class='line'>149</span> </span><span class="WHIT">      </span><span class="PUNC">.</span><span class="NAME">top</span><span class="PUNC">(</span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">n</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT"> </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">n.top</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">)</span><span class="WHIT">
<span class='line'>150</span> </span><span class="WHIT">      </span><span class="PUNC">.</span><span class="NAME">width</span><span class="PUNC">(</span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">n</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT"> </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">n.width</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">)</span><span class="WHIT">
<span class='line'>151</span> </span><span class="WHIT">      </span><span class="PUNC">.</span><span class="NAME">height</span><span class="PUNC">(</span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">n</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT"> </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">n.height</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>152</span> 
<span class='line'>153</span> </span><span class="WHIT">  </span><span class="COMM">/**
<span class='line'>154</span>    * Specifies the root key; optional. The root key is prepended to the
<span class='line'>155</span>    * &lt;tt>keys&lt;/tt> attribute for all generated nodes. This method is provided
<span class='line'>156</span>    * for convenience and does not affect layout.
<span class='line'>157</span>    *
<span class='line'>158</span>    * @param {string} v the root key.
<span class='line'>159</span>    * @function
<span class='line'>160</span>    * @name pv.Layout.icicle.prototype.root
<span class='line'>161</span>    * @returns {pv.Layout.icicle} this.
<span class='line'>162</span>    */</span><span class="WHIT">
<span class='line'>163</span> </span><span class="WHIT">  </span><span class="NAME">mark.root</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">v</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>164</span> </span><span class="WHIT">    </span><span class="NAME">keys</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">[</span><span class="NAME">v</span><span class="PUNC">]</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>165</span> </span><span class="WHIT">    </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="KEYW">this</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>166</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>167</span> 
<span class='line'>168</span> </span><span class="WHIT">  </span><span class="COMM">/**
<span class='line'>169</span>    * Specifies the sizing function. By default, the sizing function is
<span class='line'>170</span>    * &lt;tt>Number&lt;/tt>. The sizing function is invoked for each node in the tree
<span class='line'>171</span>    * (passed to the constructor): the sizing function must return
<span class='line'>172</span>    * &lt;tt>undefined&lt;/tt> or &lt;tt>NaN&lt;/tt> for internal nodes, and a number for
<span class='line'>173</span>    * leaf nodes. The aggregate sizes of internal nodes will be automatically
<span class='line'>174</span>    * computed by the layout.
<span class='line'>175</span>    *
<span class='line'>176</span>    * &lt;p>For example, if the tree data structure represents a file system, with
<span class='line'>177</span>    * files as leaf nodes, and each file has a &lt;tt>bytes&lt;/tt> attribute, you can
<span class='line'>178</span>    * specify a size function as:
<span class='line'>179</span>    *
<span class='line'>180</span>    * &lt;pre>.size(function(d) d.bytes)&lt;/pre>
<span class='line'>181</span>    *
<span class='line'>182</span>    * This function will return &lt;tt>undefined&lt;/tt> for internal nodes (since
<span class='line'>183</span>    * these do not have a &lt;tt>bytes&lt;/tt> attribute), and a number for leaf nodes.
<span class='line'>184</span>    *
<span class='line'>185</span>    * &lt;p>Note that the built-in &lt;tt>Math.sqrt&lt;/tt> and &lt;tt>Math.log&lt;/tt> methods
<span class='line'>186</span>    * can also be used as sizing functions. These function similarly to
<span class='line'>187</span>    * &lt;tt>Number&lt;/tt>, except perform a root and log scale, respectively.
<span class='line'>188</span>    *
<span class='line'>189</span>    * @param {function} f the new sizing function.
<span class='line'>190</span>    * @function
<span class='line'>191</span>    * @name pv.Layout.icicle.prototype.size
<span class='line'>192</span>    * @returns {pv.Layout.icicle} this.
<span class='line'>193</span>    */</span><span class="WHIT">
<span class='line'>194</span> </span><span class="WHIT">  </span><span class="NAME">mark.size</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">f</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>195</span> </span><span class="WHIT">    </span><span class="NAME">sizeof</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">f</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>196</span> </span><span class="WHIT">    </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="KEYW">this</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>197</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>198</span> 
<span class='line'>199</span> </span><span class="WHIT">  </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">mark</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>200</span> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>201</span> </span></pre></body></html>